import CustomTextArea from '@/components/antd-comp/input/CustomTextArea'
import { showMessage } from '@/components/antd-comp/message'
import {
  CommonSmallAdddButton,
  CommonSmallErrorTitle,
  CommonSmallSvg
} from '@/pages/workflow/components/CommonSmallTemp'
import { INPUT_CONSTRAINTS } from '@/pages/workflow/components/InspectData'
import { useAutoSave } from '@/pages/workflow/hooks/use-save'
import { useSourceOptions } from '@/pages/workflow/hooks/use-source-options'
import { useWorkFlowStore } from '@/store/workflowStore'
import { generateUUIDv4 } from '@/util/utils'
import { useEffect, useState } from 'react'

/* 意图匹配 */
export default function IntentRecognizeCont({ info, sourceOptions, editData }) {
  const [optionList, setOptionList] = useState([])
  const { getMergedGraph } = useAutoSave()
  const { removeNodesInIteration, removeNodesInIterationAllEdgs } = useWorkFlowStore()

  const { options } = useSourceOptions(info)
  useEffect(() => {
    if (Array.isArray(info.recognizeList) && info.recognizeList.length > 0) {
      const newList = info.recognizeList.map(item => ({
        ...item,
        value: item.value ? item.value : undefined
      }))

      setOptionList(newList)
    } else {
      setOptionList([])
    }
  }, [info.recognizeList])

  const delOption = i => {
    /* 查找当前要删除连线对应edgs里的id */
    const initGraph = getMergedGraph(info.id)
    const res = initGraph.edges.findIndex(item => {
      return item?.sourceHandle === optionList[i]?.id
    })
    if (res !== -1) {
      // 删除连线removeNodesInIteration
      // removeNodesInIteration([{ ...initGraph.edges[res], type: 'remove' }])
      removeNodesInIterationAllEdgs([{ id: initGraph.edges[res].id, type: 'remove' }])
    }
    const newList = [...optionList]
    newList.splice(i, 1)
    setOptionList(newList)
    editData({
      recognizeList: newList
    })
  }

  const addOption = () => {
    if (optionList.length === INPUT_CONSTRAINTS.INTENT_RECOGNIZE_MAX_CONT) {
      showMessage({
        content: INPUT_CONSTRAINTS.INTENT_RECOGNIZE_MAX_CONT_TITLE + INPUT_CONSTRAINTS.INTENT_RECOGNIZE_MAX_CONT,
        type: 'warning'
      })
      return
    }
    // 添加新项
    const newInputList = [
      ...optionList,
      {
        variable: '',
        id: generateUUIDv4()
      }
    ]
    setOptionList(newInputList)
    editData({
      recognizeList: newInputList
    })
  }

  return (
    <div className="flexCol InputCont_case">
      {/* options 参数名称 */}
      {optionList.map((item, i) => (
        <div key={i} className="flexRowStart flexRowJustBet InputCont_marTop w-[100%]">
          <CustomTextArea
            autoSize
            onChange={e => {
              const newValue = e.target.value
              if (
                newValue.length <= INPUT_CONSTRAINTS.INTENT_RECOGNIZE_MAX_SIZE_CONT
                // && (newValue === '' || /^[a-zA-Z_][a-zA-Z0-9_]*$/.test(newValue))
              ) {
                const newList = optionList.map((obj, index) => {
                  if (index === i) {
                    return { ...obj, variable: newValue }
                  }
                  return obj
                })
                setOptionList(newList)
                editData({
                  recognizeList: newList
                })
              }
            }}
            placeholder="请输入用户意图的描述，如售后问题等"
            value={item.variable}
            className="w-[92%]"
          ></CustomTextArea>
          {i > 0 && <CommonSmallSvg delOption={delOption} i={i}></CommonSmallSvg>}
        </div>
      ))}
      {/*  提示信息 */}
      <CommonSmallErrorTitle
        optionList={optionList}
        noneList={['variable']}
        repeat={'variable'}
        repeatName={'内容不能重复'}
      ></CommonSmallErrorTitle>

      {/* 新增 */}
      <CommonSmallAdddButton addOption={addOption}></CommonSmallAdddButton>
      <span className="mt-[8px]">其他意图</span>
    </div>
  )
}
